<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <title>homePage</title>
  <script type="text/javascript" th:inline="JavaScript"></script>
</head>

<body>
  <div th:fragment="keyPerson">
    <div class="keyPerson">
      <!-- 人员管理模态框 -->
      <div class="cd-popup3 keyPerson-pop" id="keyPersonModal">
        <div class="cd-popup-container3 manageModal keyPersonStyle">
          <div class="modal-top"></div>
          <div class="modal-title">人员管理</div>
          <div class="tableModal">
            <div class="searchBox">
              姓名：<input type="text" class="form-control keyPersonDateStyle keyPersonSearchInput notEmptyInput" placeholder="请输入姓名" />
              <ul class="searchList" style="right: 447px; display: none;">
                <!-- TODO -->
                <li>通江高层小区1幢</li>
                <li>通江高层小区1幢</li>
              </ul>
              <span class="btnStyle keyPersonSearchBtn" id="keyPersonSearchBtn">搜索</span>
            </div>
            <div class="tableBox">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th width="40"><input type="checkbox" id="keyPersonTableSelectAll" /></th>
                    <th width="60">序号</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>年龄</th>
                    <th>人员类型</th>
                    <th>地址</th>
                    <th>联系电话</th>
                    <th>紧急联系人姓名</th>
                    <th>紧急联系人电话</th>
                    <th>操作</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td><input type="checkbox" /></td>
                    <td>12</td>
                    <td>24字</td>
                    <td>2019-02-12 08:30</td>
                    <td>2019-02-12 08:30</td>
                    <td>发布中</td>
                    <td>
                      <span class="seeBtnStyle keyPersonEdit-trigger">查看详情</span>
                      <span class="positionBtn" id="keyPersonPositionBtn">定位</span>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
          <a href="javascript:;" class="cd-popup-close closeModal"></a>
          <!-- 分页 -->
          <div class="keyPersonPageBox pageBox" id="keyPersonPageBox">
            <ul class="pagination" id="keyPersonPage"></ul>
            <div class="pageJump">
              <span>跳转到</span>
              <input type="text" />
              <span>页</span>
              <button type="button" class="button btn btn-default">
                跳转
              </button>
            </div>
          </div>

          <div class="addBtn addKeyPerson-trigger">添加</div>
          <span class="delete" id="keyPersonDelBtn"></span>
        </div>
      </div>

      <!-- 人员 添加页面 -->
      <div class="cd-popup3 addKeyPerson-pop" id="addKeyPersonModal">
        <div class="cd-popup-container3 manageModal personManagementInfoAddPageModal addKeyPersonStyle">
          <!-- 小叉 关闭按钮 -->
          <a class="cd-popup-close closeModal" href="javascript:;"></a>
          <div class="modal-title">人员添加</div>
          <form class="personManagementInfoAddPageForm" id="addKeyPersonForm" method="post" enctype="multipart/form-data">

            <div class="addKeyPersonImg touxiang">
              <img class="pic opacity0" src="">
              <input class="upload" name="headPortraitUrl" accept="image/*" type="file" style="display: none" name="file" />
              <span class="delTouxiang">-</span>
            </div>

            <div class="rowAdd form-group">
              <span>姓名 :</span>
              <input type="text" class="notEmptyInput name" name="name" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>人员类型 :</span>
              <select class="form-control my-form-control personnelType" name="personnelType">
                <option value="普通人">普通人</option>
                <option value="低保户">低保户</option>
                <option value="残障人士">残障人士</option>
              </select>
              <!-- <input type="text" class="notEmptyInput personnelType" name="personnelType" autocomplete="off"> -->
            </div>

            <div class="rowAdd form-group">
              <span>年龄 :</span>
              <input type="text" class="notEmptyInput age" name="age" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>性别 :</span>
              <!-- <input type="text" class="notEmptyInput gender" name="gender" autocomplete="off"> -->
              <select class="form-control my-form-control gender" name="gender">
                <option value="男">男</option>
                <option value="女">女</option>
              </select>
            </div>
            <div class="rowAdd form-group">
              <span>地址 :</span>
              <input type="text" class="notEmptyInput address" name="address" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>联系电话 :</span>
              <input type="text" class="notEmptyInput telephone" name="telephone" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>紧急人姓名 :</span>
              <input type="text" class="notEmptyInput emergencyPeople" name="emergencyPeople" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>紧急人联系方式 :</span>
              <input type="text" class="notEmptyInput emergencyPhone" name="emergencyPhone" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>经度 :</span>
              <input type="text" class="notEmptyInput longitude" name="longitude" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>纬度 :</span>
              <input type="text" class="notEmptyInput latitude" name="latitude" autocomplete="off">
            </div>

            <!-- 确定按钮 -->
            <button type="submit" id="addKeyPersonBtn" class="personManagementInfoAddPageBtn personManagementInfoAddPageBtn-pop mt20"
              style="background-color: #70abe1;border: none;">确定</button>
          </form>
        </div>
      </div>

      <!-- 人员管理 修改 模态框 -->
      <div class="cd-popup3 editKeyPerson-pop" id="editKeyPersonModal">
        <div class="cd-popup-container3 manageModal personManagementInfoAddPageModal addKeyPersonStyle">
          <!-- 小叉 关闭按钮 -->
          <a class="cd-popup-close closeModal" href="javascript:;"></a>
          <div class="modal-title">人员修改</div>
          <form class="personManagementInfoAddPageForm" id="editKeyPersonForm" method="post" enctype="multipart/form-data">

            <div class="editKeyPersonImg touxiang">
              <img class="pic opacity0" src="">
              <input class="upload" name="headPortraitUrl" accept="image/*" type="file" style="display: none" name="file" />
              <span class="delTouxiang">-</span>
              <input type="hidden" class="oldPhoto">
            </div>

            <div class="rowAdd form-group">
              <span>姓名 :</span>
              <input type="text" class="notEmptyInput name" name="name" autocomplete="off">
            </div>
            <!-- <div class="rowAdd form-group">
              <span>人员类型 :</span>
              <input type="text" class="notEmptyInput personnelType" name="personnelType" autocomplete="off">
            </div> -->
            <div class="rowAdd form-group">
              <span>人员类型 :</span>
              <select class="form-control my-form-control personnelType" name="personnelType">
                <option value="普通人">普通人</option>
                <option value="低保户">低保户</option>
                <option value="残障人士">残障人士</option>
              </select>
              <!-- <input type="text" class="notEmptyInput personnelType" name="personnelType" autocomplete="off"> -->
            </div>
            <div class="rowAdd form-group">
              <span>年龄 :</span>
              <input type="text" class="notEmptyInput age" name="age" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>性别 :</span>
              <!-- <input type="text" class="notEmptyInput gender" name="gender" autocomplete="off"> -->
              <select class="form-control my-form-control gender" name="gender">
                <option value="男">男</option>
                <option value="女">女</option>
              </select>
            </div>
            <div class="rowAdd form-group">
              <span>地址 :</span>
              <input type="text" class="notEmptyInput address" name="address" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>联系电话 :</span>
              <input type="text" class="notEmptyInput telephone" name="telephone" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>紧急人姓名 :</span>
              <input type="text" class="notEmptyInput emergencyPeople" name="emergencyPeople" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>紧急人联系方式 :</span>
              <input type="text" class="notEmptyInput emergencyPhone" name="emergencyPhone" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>经度 :</span>
              <input type="text" class="notEmptyInput longitude" name="longitude" autocomplete="off">
            </div>
            <div class="rowAdd form-group">
              <span>纬度 :</span>
              <input type="text" class="notEmptyInput latitude" name="latitude" autocomplete="off">
            </div>

            <!-- 确定按钮 -->
            <button type="button" class="personManagementInfoAddPageBtn mt20 allowEdit" style="background-color: #70abe1;border: none;">修改</button>
            <button type="submit" id="editKeyPersonBtn" class="personManagementInfoAddPageBtn personManagementInfoAddPageBtn-pop none"
              style="background-color: #70abe1;border: none;">确定</button>
          </form>
        </div>
      </div>


      <!-- 删除模态框 delCoonfirmTipModal -->
      <div class="cd-popup3 delTipCancelBox" id="keyPersonDelBox">
        <div class="cd-popup-container3 tipModal delCoonfirmTipModal">
          <div class="modal-title">确定删除?</div>
          <button type="button" class="btn btn-primary delCoonfirmTipConfirm delConfirm" style="background-color: #70abe1;border: none;">确定</button>
          <button type="button" class="btn btn-primary delCancel delTipCancelBtn" style="background-color: #70abe1;border: none;">取消</button>
        </div>
      </div>

    </div>
  </div>
</body>

</html>